<template>
      <div>
            <ul>
                  <li v-for="(item, index) in 10" :key="index"> {{ item }}</li>
            </ul>
      </div>
</template>

<style scoped>
ul li {
      display: flex;
      justify-content: center;
      align-items: center;
      font-size: 30px;
      height: 400px;
}
ul li:nth-child(even) {
      color: #fff;
      background-color: var(--main-color);
}
</style>